<template>
    <div>
        <div>
        <div>
            <el-row align="middle" class="mytop">
<!--                <el-col :span="6">-->
<!--                    <el-date-picker-->
<!--                            v-model="datatime"-->
<!--                            value-format="yyyy/MM/dd"-->
<!--                            type="monthrange"-->
<!--                            range-separator="至"-->
<!--                            start-placeholder="开始月份"-->
<!--                            end-placeholder="结束月份" disabled>-->
<!--                    </el-date-picker>-->
<!--                </el-col>-->
                <el-col :span="6">
                    <el-input v-model="idTest" placeholder="请选择商户"></el-input>
                </el-col>
                <el-col :span="1">
                    <el-button type="primary" icon="el-icon-edit" @click="setCid" circle></el-button>
                </el-col>
                <el-col :span="2">
                    <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
                </el-col>
            </el-row>
            <el-table
                    :data="ordersList" style="width: 100%">
                <el-table-column property="pid" label="订单编号" width="120"></el-table-column>
                <el-table-column property="users.uname" label="用户名称" width="120"></el-table-column>
                <el-table-column property="sumPrice" label="总价格"></el-table-column>
                <el-table-column property="orderDate" label="订单时间"></el-table-column>
                <el-table-column label="订单状态"><el-tag type="success">订单完成</el-tag></el-table-column>
            </el-table>
            <div>
                <!-- 分页 -->
                <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="pageno"
                        :page-sizes="[5, 10, 15, 20]"
                        :page-size="pagesize"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="total"
                >
                </el-pagination>
            </div>
            <div>
                <el-col class="myright" :offset="22">
                    <el-row>
                        <el-col :span="2">
                            <el-button type="danger" @click="submit">工资结算</el-button>                        </el-col>
                    </el-row>
                </el-col>
            </div>
            </div>
        </div>
        <div>
            <component ref="commercial_dialog" is="commercial_dialog"></component>
        </div>
    </div>
</template>

<script>
    import commercial_dialog from "../commercial_dialog";
    import Dispatch_warehouse_goods from "../management_warehouseInfo/Dispatch_warehouse_goods";
    export default {
        name: "wageSettlementOfMerchants",
        data(){
            return{
                id:"",
                idTest:"",
                datatime:[],
                orders:{},
                ordersList:[],
                pageno: 1,
                pagesize: 5,
                total: 1
            }
        },
        methods:{
            getData(){
                let params=new URLSearchParams();
                params.append("pageno", this.pageno);
                params.append("pagesize", this.pagesize);
                params.append("commId", this.id);
                //异步，分页查询
                this.$axios.get("merchantsAndSettlementQuery.action",{params:params}).
                then((response)=> {   //异步调用成功执行
                    //将查询到的数据存入对象数组中
                    this.ordersList=response.data.records;
                    this.total = response.data.originalData.length;
                }).catch(function (error) {//异步调用失败执行
                    alert(error);
                });
            },
            search() {
                this.getData();
            },
            handleSizeChange(val) {
                //每页范围
                this.pagesize = val;
                this.getData();
            },
            handleCurrentChange(val) {
                //当前页
                this.pageno = val;
                this.getData();
            },
            submit(){
                //检查id是否为空
                if(this.id!=""){
                    //异步，对该商户下的所有满足条件的订单进行工资结算
                    this.$axios.get("merchantsAndSettlement.action/"+this.id,null)
                        .then(res=>{
                            if(res.data.x){
                                this.$message.success(res.data.msg);
                            }else {
                                this.$message.error(res.data.msg);
                            }
                            //重新查询一次数据
                            this.getData();
                        })
                        .catch(err=>{
                            this.$message.warning(err);
                            alert(err);
                        })
                }else {
                    this.$message.warning("结算工资前，请先选中结算商户");
                }
            },
            setCid(){
                this.$refs.commercial_dialog.dialogVisible=true;
                this.$refs.commercial_dialog.getData();
            },
            getCid(row){
                this.id=row.id;
                this.idTest="结算商户为："+row.uname;
                this.getData();
            }
        },
        components:{
            commercial_dialog
        }
    }
</script>

<style scoped>

</style>
